<template>
    <div style="display: flex;">
        <ul class="ul">
            <li v-for="item in list">{{ item }}</li>
        </ul>
        <div> 画布大小

            X<el-input-number :controls="false" size="small" v-model="store.canvasInfo.x" />
            Y<el-input-number :controls="false" size="small" v-model="store.canvasInfo.y" />
        </div>

    </div>
</template>

<script setup lang="ts">
import { ref } from 'vue';
import { userCanvasStore } from '../../store';
const store = userCanvasStore()


const list = ref()
list.value = [
    "JSON", "撤销", "重做", "插入图片", "预览", "保存", "清空画布"
]
</script>

<style scoped>
.ul {
    width: 500px;
    display: flex;
    justify-content: space-between;
    margin-right: 50px;
}

li {
    /* box-shadow: 2px 0px 2px 0px #ccc; */
}
</style>